<template>
    <!-- 轮播图 -->
            <Swiper class="Swiper">
                <Swiper-item v-for="(item,index) in banners" :key="index">
                    <a :href="item.link">
                        <img 
                        :src="item.image" 
                        :alt="item.title"
                        @load="imageload"
                        >
                    </a>
                </Swiper-item>
            </Swiper>
</template>
<script>
// import SwiPer from '../../components/common/swiper/Swiper'
import {Swiper,SwiperItem} from '../../../components/common/swiper/index'
export default {
    name:"HomeSwiper",
    props:{
        banners:{
            type:Array,
            default(){
                return []
            }
        }
    },
    data(){
        return {
            isLoad:false
        }
    },
    components:{
        Swiper,SwiperItem
    },
    methods:{
        imageload(){
            if(!this.isLoad){
            // 当只要有一张图片被加载就发射出一次事件，当图片又加载时不再发射出事件
            this.$emit('swiperimageload')
            this.isLoad = true
            }
           
        }
    }
}
</script>
<style scoped>
    .Swiper{
        margin-top: 44px;
    }
</style>